
<%@ page contentType="text/html;charset=UTF-8" language="java" isELIgnored="false"%>
<html>
<head>
    <meta charset="UTF-8">
    <title>读了么！-确认订单</title>
    <link rel="stylesheet" href="layui/css/layui.css" media="all">
    <link href="style/order(2).css" rel="stylesheet" type="text/css">
    <script src="layui/layui.all.js" charset="utf-8"></script>
    <link rel="stylesheet" href="style/First_Page.css"/>
    <link rel="stylesheet" href="style/Choose_Address.css"/>
    <script type="text/javascript" src="js/First_Page.js"></script>
    <script type="text/javascript" src="js/Choose_Address.js"></script>
    <script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.4.1.js"></script>
    <script type="text/javascript">
        window.onload=function () {
            /*$.ajax({
                type:'get',
                async:true,
                dataType:'json',
                url:'/address.json' ,//接口
                success:function (data) {
                    alert(data);
                    for(var i=0;i<per.length;i++){
                        //var info=JSON.parse(per[i]);
                        var info=JSON.stringify(per[i]);
                        var tmp = document.createElement('li');
                        if(i==0){
                            tmp.innerHTML = "<input type=\"radio\" id=\""+i+"\" value=\"1\"  checked=\"checked\" name=\"address_checked\">\n" +
                                "                <p>"+per[i].county+" 河北省 秦皇岛市 海港区 白塔岭街 燕山大学西校区 12345678912 任航</p>";
                        }
                        else{
                            tmp.innerHTML = "<input type=\"radio\" id=\""+i+"\" value=\"1\" name=\"address_checked\">\n" +
                                "                <p>"+per[i].county+" 河北省 秦皇岛市 海港区 白塔岭街 燕山大学西校区 12345678912 任航</p>";
                        }
                        document.getElementById('address').appendChild(tmp);
                    }
                }
            });*/
            // alert(per[0].deliveryId);
            $.ajax({
                type:'post',
                async:true,
                dataType:'json',
                url:'/show/address' ,//接口
                success:function (data) {
                    $.each(data, function (i, item) {
                        var deliveryId = item.deliveryId;
                        var name = item.name;
                        var country = item.country;
                        var county = item.county;
                        var province = item.province;
                        var city = item.city;
                        var street = item.street;
                        var detailedAddress = item.detailedAddress;
                        var phoneNumber = item.phoneNumber;
                        var tmp = document.createElement('li');
                        if(i==0){
                            tmp.innerHTML = "<input type=\"radio\" id=\""+i+"\" value=\""+deliveryId+"\"  checked=\"checked\" name=\"address_checked\">\n" +
                                "                <p>"+country+" "+province+" "+"  "+city+"  "+county+ "  "+ street+" "+detailedAddress+"  ("+name+"  收) "+phoneNumber+"</p>";
                        }
                        else{
                            tmp.innerHTML = "<input type=\"radio\" id=\""+i+"\" value=\""+deliveryId+"\" name=\"address_checked\">\n" +
                                "                <p>"+country+" "+province+" "+"  "+city+"  "+county+ "  "+ street+" "+detailedAddress+"  ("+name+"  收) "+phoneNumber+"</p>";
                        }
                        document.getElementById('address').appendChild(tmp);
                    });
                }
            });


        }
    </script>
</head>
<body>
<div id="main_head_box">
    <div class="head_box">
        <div id="head_wrap">
            <div id="head_right">
                <div id="head_landing">
                    <a id="exit" style="display:inline;float:right;margin-left:15px;" href="First_Page.jsp" onclick="login2exit()">注销</a>
                    <a href="Self_Information.jsp"><img src="${sessionScope.user.avatar}" id="avatar" style="display: inline;height:30px;width:30px;border-radius: 45px;margin-right:50px;margin-top: 5px;"></a>
                </div>
            </div>
        </div>
    </div>
    <div id="menu_wrap">
        <p id="menu_logo">读了么 <i>DuLeMe.com</i></p>
        <div id="find_wrap">
            <div id="find_bar">
                <input type="text" id="find_input">
            </div>
            <div id="find_but" onclick="search_method()"><a>GO</a></div>
        </div>
    </div>
</div>
<div id="choose_address">
    <div id="choose_address_title">
        <p>选择配送地址</p>
    </div>
    <div id="choose_address_main">
        <ul id="address">
<%--            <li>--%>
<%--                <input type="radio" value="1"  checked="checked" name="address_checked">--%>
<%--                <p>中国 河北省 秦皇岛市 海港区 白塔岭街 燕山大学西校区 12345678912 任航</p>--%>
<%--            </li>--%>
<%--            <li>--%>
<%--                <input type="radio" value="1" name="address_checked">--%>
<%--                <p>中国 河北省 秦皇岛市 海港区 白塔岭街 燕山大学西校区 12345678912 任航</p>--%>
<%--            </li>--%>
<%--            <li>--%>
<%--                <input type="radio" value="1" name="address_checked">--%>
<%--                <p>中国 河北省 秦皇岛市 海港区 白塔岭街 燕山大学西校区 12345678912 任航</p>--%>
<%--            </li>--%>
<%--            <li>--%>
<%--                <input type="radio" value="1" name="address_checked">--%>
<%--                <p>中国 河北省 秦皇岛市 海港区 白塔岭街 燕山大学西校区 12345678912 任航</p>--%>
<%--            </li>--%>
        </ul>
        <div id="choose_address_settled">
            <input type="button" id="buy_button" value="添加新地址" onclick="address_add()">
        </div>
    </div>
</div>

<div class="orderOK">
    <h2>确认订单信息：</h2>
    <div class="head">
        <span class="span1">店铺商品</span>
        <span class="span2">单价/元</span>
        <span class="span3">数量/件</span>
        <span class="span4">小计/元</span>
    </div>
    <div class="order-order">
    </div>
    <script>
        var orderId='';
        var orderState='';
        $(document).ready(function () {
            $.ajax({
                url: '/user/order',
                dataType: 'json',
                method: 'post',
                data: {},
                success: function (data) {
                    var list = new Array();
                    for(var key in data.orderMap)
                    {
                        list.push(key);
                    }
                    var totalPrice = 0;
                    var count = 0;
                    for (var i=0;i<list.length;i++){
                        $.each(data.orderMap[list[i]].bookList, function (i, item) {
                            var shopName = item.shopName;
                            var bookName = item.bookName;
                            var price = item.price;//单价
                            var total=item.total;
                            var bookNum=item.bookNum;
                            count+=bookNum;
                            totalPrice+=total;
                            console.log(shopName);
                            $(".order-order").append("<div class='shopname'>" + shopName + "</div>" + "<div class='bookname'>" + "《"+bookName +"》"+"</div><div class='price'>"+ price+"</div><div class='bookNum'>"+  bookNum + "</div><div class='xj'>"+total+"</div>");
                        });
                    }
                    $("#totalP").text(totalPrice);
                    $("#count").text('总'+count+'件');
                }
            });
        })
    </script>
    <div class="allInfo">
        <h1>实付款：</h1>
        <a style="color: #4E5465;font-size: 22px;margin-left: 70px">￥</a>
        <a style="color: red;font-size: 30px" id="totalP"></a>
        <a style="font-size: 20px;display: block;margin-left: 220px;margin-top: 15px" id="count"></a>
    </div>
    <div class="btnSubmit">
        <a href="#" style="border: 1px dotted red">返回购物车</a>
        <input type="submit" value="提交订单并去支付" id="submit_button" class="btn">
        <script>

            $("#submit_button").click(function () {
                var totalPrice = document.getElementById("totalP").text;
                var len= $("#address li").length;
                for (var i=0;i<len;i++){
                    var li = document.getElementById(i.toString());
                    if (li.checked==true){
                        $.ajax({
                            url:'/send',
                            dataType:'json',
                            method:'post',
                            data:{
                                "deliveryID":li.value,
                                "totalPrice":totalPrice,
                            },
                            success:function (data) {
                                if (data.result=="1"){
                                    window.location.href="pay.jsp";
                                }else {
                                    alert("提交信息失败");
                                }
                            }
                        });
                    }
                }

            });
        </script>
    </div>
</div>

<div id="foot_box">
    <div id="foot_wrap">
        <div class="foot_top">
            <ul>
                <li><a href="Self_Information.jsp">个人信息设置</a></li>
                <li class="font_top_i">|</li>
                <li><a href="First_Page.jsp">返回首页</a></li>
                <li class="font_top_i">|</li>
                <li>用户购物指南</li>
                <li class="font_top_i">|</li>
                <li><a href="user_Agreement.html">用户协议须知</a></li>
            </ul>
        </div>
        <div class="foot_bottom">
            <span> <a href="">返回顶部</a></span>
        </div>
    </div>
</div>
</body>
</html>
